<template>
	<view class="app">
		<view class="bg">
			<!-- <image
				src="https://mp-adf91af7-51bf-4e2e-abae-1ed51120ab92.cdn.bspapp.com/cloudstorage/d2dd3275-a2db-4a34-b1ed-d4f1cd13fef0.jpg"
				mode="widthFix" @click="pageTo('/pages_case/case/detail')"></image> -->
			<image
				:src="form.img1[0]"
				mode="widthFix" @click="pageTo('/pages_case/case/detail')"></image>
		</view>
		<view class="bg-text">
			食品安全无小事<text class="blank"></text>消费调解零距离
		</view>

		<view class="index-content index-content-image">
			<view class="flex-content">
				<view class="nav-item" v-for="(item, index) in navs" :key="index" @click="pageTo(item.href)">
					<image class="item-bg" :src="item.bg" mode="aspectFit"></image>
					<view class="nav-item-title">{{item.title}}</view>
				</view>
			</view>
		</view>
		
		<!-- <u-button @click="pageTo('/pages/intro/live_player')">直播测试</u-button> -->
		<!-- <u-button @click="testAssign">分配调解员测试</u-button> -->
		<!-- <u-button @click="testGenAccount">生成临时账号测试</u-button> -->
		
		<view class="index-content">
			<u-section title="特邀专家" sub-title="更多" @click="pageTo('/pages/intro/index?group=1')"></u-section>
			<swiper class="swiper1" :circular="true" :autoplay="true" duration="500" interval="5000"
				@change="changeSwiper1">
				<swiper-item v-for="(itemBar, indexBar) in employeeList1" :key="indexBar">
					<view class="flex-content">
						<view class="demo-warter" v-for="(item, index) in itemBar.group" :key="index" @click="pageTo('/pages/intro/detail?id=' + item._id)">
							<image class="photo" :src="item.avatar" mode="aspectFill"></image>
							<view class="demo-title">
								{{item.nickname}}
							</view>
						</view>
					</view>

				</swiper-item>
			</swiper>
		</view>

		<view class="index-content">
			<u-section title="调解员公示" sub-title="更多" @click="pageTo('/pages/intro/index?group=0')"></u-section>
			<swiper class="swiper" :circular="true" :autoplay="true" duration="500" interval="5000">
				<swiper-item v-for="(itemBar, indexBar) in employeeList0" :key="indexBar">
					<view class="flex-content">
						<view class="demo-warter" v-for="(item, index) in itemBar.group" :key="index">
							<image class="photo" :src="item.avatar" mode="aspectFill"></image>
							<view class="demo-title">
								{{item.nickname}}
							</view>
							<view class="row">
								<view class="row form-col">
									<view class="demo-price">{{item.caseSuccess || 0}}</view>
									<view class="">成功</view>
								</view>
								<view class="row form-col">
									<view class="demo-price">{{item.caseTotal || 0}}</view>
									<view class="">总数</view>
								</view>
							</view>
						</view>
					</view>

				</swiper-item>
			</swiper>
		</view>

	</view>
</template>

<script>
	import organization from '@/data/organization.js'
	export default {
		data() {
			return {
				form: {
					img1: []
				},
				navs: [{
					bg: '/static/icon/home/nav1.jpg',
					title: '调解须知',
					href: '/pages_case/help/intro',
				}, {
					bg: '/static/icon/home/nav2.jpg',
					title: '调解进度',
					href: '/pages_case/case/list',
				}, {
					bg: '/static/icon/home/nav3.jpg',
					title: '调解案例',
					href: '/pages_case/help/example/example',
				}, {
					bg: '/static/icon/home/nav4.jpg',
					title: '留言咨询',
					href: '/pages/feedback/list',
				}],
				employeeList0: [], // 调解员列表
				employeeList1: [], // 特邀专家列表
			}
		},
		onLoad(options = {}) {
			this.initPage(options);
		},
		methods: {
			// 测试生成临时账号
			testGenAccount() {
				let username = vk.pubfn.random(8, "ABCDEFGHJKILMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz");
				let data = {
					username,
					nickname: '测试生成被申请人临时账号',
					mobile: '15520118341222',
					address: '塔湾',
					dcloud_appid: [vk.getVuex('$app.appInfo.appId')],
				}
				// 需要先检查 mobile 是否手机号
				// console.log(data.mobile, vk.pubfn.test(data.mobile, 'mobile'))
				
				// 先根据手机号查询已有账号
				let query = {
					// 表单数据源
					formData: {
						mobile: data.mobile,
					},
					// 查询匹配规则
					columns: [{
						key: "mobile",
						mode: "="
					}],
				}
				vk.callFunction({
						url: this.$api.GetUserAccount,
						loading: true,
						data: query
					})
					.then(res => {
						console.log('根据手机号查询已有账号res', res)
						if(res.item){
							// 已有账号
							// res.item._id
							// username
						}else{
							// 注册账号
						}
					})
				
				// vk.callFunction({
				// 		url: this.$api.UserGen,
				// 		loading: true,
				// 		data
				// 	})
				// 	.then(res => {
				// 		console.log('测试生成临时账号res', res)
				// 		// {code: 0, msg: '', type: 'register', uid: '643e572ee766bb2975b3b0c8'}
						
				// 		vk.toast("已生成临时账号");
				// 	})
				// 	.catch(err => {
				// 		console.log('生成临时账号错误 err', err);
				// 		// 已有账号，直接使用。  {code: -1, msg: '手机号【15840346210】已注册!'}
						
				// 	})
			},
			testAssign(){
				// 发送 被分配通知 给调解员
				vk.callFunction({
						url: this.$api.SendAssign,
						data: {
							case_id: 'test1',
							article_number: '测试20230801-1119',
							user_ids: ['64c87b5ffe975fba5a2b1646'], // 调解员id 64c87b5ffe975fba5a2b1646 tjtest01
							user_phones: [], // 调解员手机，暂不用。 employeeList的原因，导致为空
							user_ids2: ['6438a389f5cf3a3e0934d344'], // 申请人id 6438a389f5cf3a3e0934d344 6210用户
							user_phones2: ['15840346210'], // 申请人手机
						},
						needAlert: false,
						success: res => {
							console.log('被分配通知 res', res);
						},
						fail: err => {
							console.log('被分配通知 err', err);
						},
						complete: () => {
							vk.alert('分配成功');
						}
					})
			},
			initPage(options = {}) {
				this.getData();
				this.getEmployeeList();
			},
			pageTo(url) {
				vk.navigateTo(url);
			},
			// 应用详情
			getData(){
				vk.callFunction({
						url: this.$api.AppInfo,
						loading: true,
						data: {
							appid: vk.getVuex('$app.appInfo.appId')
						},
					})
					.then(res => {
						this.form = res.item
					})
			},
			// 格式化img标签，避免img超出页面
			parseRichText(html) {
				if (html) {
					let arr = html.split('<img');
					html = arr.join('<img width=100%');
				}
				return html;
			},
			changeSwiper1(e) {
				// console.log(e)
				// this.curSwiper1 = e.detail.current
			},
			getEmployeeList() {
				// 列表查询请求数据
				let queryForm1 = {
					// 分页数据
					pagination: {
						pageIndex: 1, //当前页码
						pageSize: 100, //每页显示数量
					},
					// 表单数据源
					formData: {
						role: 'tiaojie_employee',
						group: 0
					},
					// 查询匹配规则
					columns: [{
						key: "role",
						mode: "="
					}, {
						key: "group",
						mode: "="
					}],
					// 排序规则
					sortRule: [{
						name: "sort",
						type: "asc"
					}, {
						name: "_add_time",
						type: "desc"
					}]
				};
				vk.callFunction({
						url: this.$api.EmployeeList,
						loading: true,
						data: {
							...queryForm1
						},
					})
					.then(res => {
						// console.log('调解员列表', res.rows)
						// this.employeeList = res.rows;

						let rows = res.rows;
						let empArr = [];
						let barList = [];
						rows.forEach((item, index) => {
							barList.push(item)
							if (index % 3 == 2) {
								empArr.push({
									"group": barList
								});
								barList = [];
							}
						})

						if (rows.length - empArr.length * 3 == 2) {
							barList = [];
							barList.push(rows[rows.length - 2])
							barList.push(rows[rows.length - 1])
							empArr.push({
								"group": barList
							});
						} else if (rows.length - empArr.length * 3 == 1) {
							barList = [];
							barList.push(rows[rows.length - 1])
							empArr.push({
								"group": barList
							});
						}
						this.employeeList0 = empArr
						// console.log('调解员', this.employeeList0)
					})

				queryForm1.formData.group = 1
				vk.callFunction({
						url: this.$api.EmployeeList,
						loading: true,
						data: {
							...queryForm1
						},
					})
					.then(res => {
						// console.log('特邀专家列表', res.rows)
						// this.employeeList = res.rows;

						let rows = res.rows;
						let empArr = [];
						let barList = [];
						rows.forEach((item, index) => {
							barList.push(item)
							if (index % 3 == 2) {
								empArr.push({
									"group": barList
								});
								barList = [];
							}
						})

						if (rows.length - empArr.length * 3 == 2) {
							barList = [];
							barList.push(rows[rows.length - 2])
							barList.push(rows[rows.length - 1])
							empArr.push({
								"group": barList
							});
						} else if (rows.length - empArr.length * 3 == 1) {
							barList = [];
							barList.push(rows[rows.length - 1])
							empArr.push({
								"group": barList
							});
						}
						this.employeeList1 = empArr
						// console.log('特邀专家', this.employeeList1)
					})

			},
		}
	}
</script>

<style lang="scss" scoped>
	.section {
		margin: 20rpx 0 10rpx;
	}

	.content {
		margin-bottom: 20rpx;
		padding: 10rpx 20rpx;
		border-bottom: darkcyan 1px dashed;
	}

	.channel {
		margin: 50rpx auto 50rpx;
		padding: 20rpx 20rpx;
		width: 90%;
		border: darkcyan 1px dashed;
		border-radius: 20rpx;
		box-shadow: 0 1px 2px 1px #aaa;
	}

	.banner {
		display: block;
		margin: 40rpx auto 50rpx;
		width: 90%;
		height: 150px;
		text-align: center;
	}

	.photo {
		width: 22vw;
		height: 32vw;
	}

	.swiper {
		height: 56vw;
	}
	.swiper1 {
		height: 50vw;
	}
	.blank{
		padding: 0 20rpx;
	}
</style>